<template>
  <div class="empty">
    <slot>
      <template>{{ placeholder }}</template>
    </slot>
  </div>
</template>

<script>
  import { defineComponent } from 'vue'
  export default defineComponent({
    name: 'Empty',
    props: {
      placeholder: String,
    }
  })
</script>

<style lang="scss" scoped>
//   @import 'src/assets/styles/init.scss';
  .empty {
    position: relative;
    display: flex;
    width: 100%;
    height: 100%;
    min-height: 5em;
    text-align: center;
    justify-content: center;
    align-items: center;
    // color: $text-dividers;
    letter-spacing: .1em;
  }
</style>
